<template>
	<el-container>
		<el-header>
			<div class="left-panel">
				<el-button v-if="$AUTH('hygl:hyUserGz:add')" type="primary" icon="el-icon-plus" @click="add">
				</el-button>
			</div>
			<div class="right-panel">
				<div class="right-panel-search">
					<!-- 日期时间范围 -->
					<el-date-picker v-model="search.createTime" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss"
						start-placeholder="开始日期" end-placeholder="结束日期" style="width: 100%;"></el-date-picker>
					<el-input v-model="search.hyUserGzId" placeholder="个人用户跟踪表" clearable></el-input>
					<el-input v-model="search.hyUserId" placeholder="会员" clearable></el-input>
					<el-input v-model="search.doTime" placeholder="日期" clearable></el-input>
					<el-input v-model="search.doSysid" placeholder="跟踪人id" clearable></el-input>
					<el-input v-model="search.doMsg" placeholder="跟踪记录" clearable></el-input>
					<el-input v-model="search.doType" placeholder="1电话 2邮件 3即时通讯qq 微信 4我上门拜访 5客户来我公司" clearable>
					</el-input>
					<el-input v-model="search.hxState" placeholder="1维护 9继续加紧跟踪 5普通跟踪 0不建议跟踪" clearable></el-input>
					<el-input v-model="search.hxMsg" placeholder="后续建议" clearable></el-input>
					<el-input v-model="search.deleted" placeholder="" clearable></el-input>
					<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
				</div>
			</div>
		</el-header>
		<el-main class="nopadding">
			<scTable ref="table" :apiObj="apiObj" row-key="hyUserGzId" @selection-change="selectionChange" stripe>
				<el-table-column type="selection" width="50"></el-table-column>
				<el-table-column label="个人用户跟踪表" prop="hyUserGzId" width="150"></el-table-column>
				<el-table-column label="会员" prop="userName" width="150"></el-table-column>
				<el-table-column label="日期" prop="doTime" width="150"></el-table-column>
				<el-table-column label="跟踪人id" prop="doSysid" width="150"></el-table-column>
				<el-table-column label="跟踪记录" prop="doMsg" width="150"></el-table-column>
				<el-table-column label="1电话 2邮件 3即时通讯qq 微信 4我上门拜访 5客户来我公司" width="150">
					<template #default="node1">
						<span v-if="node1.row.doType==1">电话</span>
						<span v-if="node1.row.doType==2">邮件</span>
						<span v-if="node1.row.doType==3">即时通讯qq微信</span>
						<span v-if="node1.row.doType==4">我上门拜访</span>
						<span v-if="node1.row.doType==5">客户来我公司</span>
					</template>
				</el-table-column>
				<el-table-column label="1维护 9继续加紧跟踪 5普通跟踪 0不建议跟踪" prop="hxState" width="150"></el-table-column>
				<el-table-column label="后续建议" prop="hxMsg" width="150"></el-table-column>
				<el-table-column label="" prop="deleted" width="150"></el-table-column>
				<!--    <el-table-column label="创建时间" prop="createTime" width="150" :formatter="formatDate"></el-table-column>-->
				<el-table-column label="操作" fixed="right" align="right">
					<template #default="scope">
						<el-button v-if="$AUTH('hygl:hyUserGz:edit')" type="text" size="small"
							@click="table_edit(scope.row, scope.$index)">编辑</el-button>
						<el-divider direction="vertical"></el-divider>
						<el-button v-if="$AUTH('hygl:hyUserGz:del')" type="text" size="small"
							@click="table_del(scope.row, scope.$index)">删除</el-button>
					</template>
				</el-table-column>
			</scTable>
		</el-main>
	</el-container>

	<hyUserGzEdit-dialog v-if="dialog.hyUserGzEdit" ref="hyUserGzEditDialog" @success="handleSaveSuccess"
		@closed="dialog.hyUserGzEdit=false"></hyUserGzEdit-dialog>
</template>

<script>
	import hyUserGzEditDialog from './hyUserGzEdit'; //1--导入
	export default {
		name: 'hyUserGz',
		components: {
			hyUserGzEditDialog //2发布
		},
		data() {
			return {
				dialog: {
					hyUserGzEdit: false
				},
				apiObj: this.$API.hygl.hyUserGz.list,
				selection: [],
				search: {
					keyword: null,
					createTime: null
				}
			}
		},
		methods: {
			//添加
			add() {
				this.dialog.hyUserGzEdit = true
				this.$nextTick(() => {
					this.$refs.hyUserGzEditDialog.open()
				})
			},
			//编辑
			table_edit(row) {
				this.dialog.hyUserGzEdit = true
				this.$nextTick(() => {
					this.$refs.hyUserGzEditDialog.open('edit').setData(row)
				})
			},
			//删除
			async table_del(row) {
				var confirm = await this.$confirm('确定删除选中的项吗？', '提示', {
					confirmButtonText: 'ok',
					type: 'warning'
				}).catch(() => {})
				if (confirm !== 'confirm') {
					return false;
				}
				var res = await this.$API.test.hyUserGz.delete.delete(row.hyUserGzId);
				if (res.code === 2000) {
					this.$refs.table.refresh();
					this.$message.success("删除成功");
				} else {
					this.$alert(res.message, "提示", {
						type: 'error'
					});
				}
			},
			//表格选择后回调事件
			selectionChange(selection) {
				this.selection = selection;
			},
			//搜索
			upsearch() {
				this.$refs.table.upData(this.search);
			},
			//本地更新数据
			handleSaveSuccess() {
				this.$refs.table.refresh();
			},
			handlePermissionSuccess() {
				this.$refs.table.refresh();
			},
			handleDataSuccess() {
				this.$refs.table.refresh();
			},
			formatDate(row, column) { // 获取单元格数据
				let data = row[column.property];
				if (data == null) {
					return null;
				}
				let dt = new Date(data);
				return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate() + ' ' + dt.getHours() + ':' + dt
					.getMinutes() + ':' + dt.getSeconds();
			},
		}
	}
</script>
<style>
</style>
